<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        /* 1.* */
        /* *{
            color: aqua;
        } */
        /* 2.标签选择器 */
        span {
            display: block;
            margin-right: 20px;
            border: 1px solid rgba(99, 155, 61, 0.541);
        }

        /* 3.类选择器 */
        .wrapper {
            color: aquamarine;
        }

        /* 4.id选择器 */
        #content {
            color: bisque;
        }

        /* 5.派出选择器 */
        .box2 li {
            color: cornflowerblue;
        }
    </style>
</head>

<body>
    <p>这是p标签</p>
    <strong>这是strong标签</strong>

    <span>这个是span标签</span>
    <div>这个是div标签</div>

    <div class="wrapper">这个是div标签</div>
    <p class="wrapper">这是一个p标签</p>

    <p id="content">这是内容</p>

    <ul class="box1">
        <li>li001</li>
        <li>li002</li>
        <li>li003</li>
    </ul>
    <ul class="box2">
        <li>li001</li>
        <li>li002</li>
        <li>li003
            <ul>
                <li>subli1</li>
                <li>subli2</li>
            </ul>
        </li>
    </ul>
</body>

</html>